import SwiftUI
import Lottie

struct DeviceView: View {
    @StateObject private var viewModel = DeviceInfoViewModel()
    @Environment(\.presentationMode) var presentationMode

    @State private var isMap = false
    @State private var isIp = false
    var body: some View {
        NavigationView {
            ZStack {
              
                                   
                MainView()
 
                VStack {
                    Back(title: "Device Information", onBackTap: {
                        self.presentationMode.wrappedValue.dismiss()
                    }, onImageTap: {})

                    HStack {
                               VStack(alignment: .leading, spacing: 10) {
                                   deviceInfoRow(title: "Device Name", info: viewModel.deviceName)
                                   deviceInfoRow(title: "Device Model", info: viewModel.deviceModel)
                                   deviceInfoRow(title: "System Version", info: viewModel.systemVersion)
                                   deviceInfoRow(title: "Storage Capacity", info: viewModel.storageCapacity)
                                   deviceInfoRow(title: "Free Disk Space", info: viewModel.freeDiskSpace)
                                   deviceInfoRow(title: "Local IP Address", info: viewModel.localIPAddress)
                                   deviceInfoRow(title: "System Language", info: viewModel.systemLanguage)
                                   deviceInfoRow(title: "Network Operator", info: viewModel.networkOperator)
                               }
                               .padding(20)
                               .background(Color.gray.opacity(0.2))
                               .cornerRadius(10)
                               .shadow(radius: 5)
                           }
                           .padding(.horizontal, 20)
                    
                    
                    
                    Button(action: {
                        isMap.toggle()
                    } ){
                        HStack {
                            HStack{
                                Text("MAP")
                                    .foregroundColor(Color("alphaStart"))
                                    .font(.title2)
                                Spacer()
                                Image("left")
                            } .padding(15)
                                .background(Color.gray.opacity(0.2))
                                .cornerRadius(10)
                            .shadow(radius: 5)
                        }.padding(.horizontal,20)
                            .padding(.top,20)
                    }
                    
                    Button(action: {
                        isIp.toggle()
                    } ){
                        HStack {
                            HStack{
                                Text("IP Info")
                                    .foregroundColor(Color("alphaStart"))
                                    .font(.title2)
                                Spacer()
                                Image("left")
                            } .padding(15)
                                .background(Color.gray.opacity(0.2))
                                .cornerRadius(10)
                            .shadow(radius: 5)
                        }.padding(.horizontal,20)
                            .padding(.top,20)
                    }
                    
                    Button(action: {
                        showToast(message: "Data refresh successful.", duration: 2.0)
                    }, label: {
                        VStack {
                            HStack {
                                Spacer()
                                Text("Test Again")
                                    .font(.title3)
                                    .foregroundColor(.black)
                                    .padding(.all,10)
                                Spacer()
                            }
                            .background(Color("alphaStart"))
                            .cornerRadius(10)
                            .padding()
                        }
                    })
                    NavigationLink(destination: MapView(), isActive: $isMap) {
                        EmptyView()
                    }.hidden()
                    NavigationLink(destination: IPInfoView(), isActive: $isIp) {
                        EmptyView()
                    }.hidden()
                    
                    Spacer()
                }
            }
            .navigationBarHidden(true)
            .navigationBarBackButtonHidden(true)
            .navigationViewStyle(StackNavigationViewStyle())
        }
        .navigationBarHidden(true)
        .navigationBarBackButtonHidden(true)
        .navigationViewStyle(StackNavigationViewStyle())
        .edgesIgnoringSafeArea(.all)
    }
    
    private func deviceInfoRow(title: String, info: String) -> some View {
        HStack {
            Text(title+":")
                .font(.body)
                .bold()
                .foregroundColor(.white) // 设置字体颜色为白色
                .frame(width: 150, alignment: .leading) // 根据内容调整宽度
            Spacer()
            Text(info)
                .font(.body)
                .foregroundColor(.white) // 设置字体颜色为白色
            
        }
    }
}

#Preview {
    DeviceView()
}

